<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ page import="edu.uclm.esi.tysw.tusEntradas.domain.Butaca,edu.uclm.esi.tysw.tusEntradas.domain.Sesion, java.util.ArrayList, edu.uclm.esi.tysw.tusEntradas.domain.Recintos,
 java.util.ArrayList,org.json.simple.JSONObject, org.json.simple.parser.JSONParser, org.json.simple.parser.ParseException, java.util.Date, java.text.*, java.sql.Timestamp" %>
<!DOCTYPE html">
<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
<head>
<%@ page import="edu.uclm.esi.tysw.tusEntradas.domain.Recintos"%>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>CrearEspectaculo</title>
<script type="text/javascript" src="scripts/GuardarSesion.js"></script>
<script type="text/javascript">

var z = document.createElement("form");
z.id="formAction3";
z.action="ListaRecintos";

	//Recintos a pelo
	var recBD=[];
	var rowDisp="";
	var rowAsig="";
	var rowDispS="";
	var rowAsigS="";
	<%Recintos recipi=new Recintos();%>
	
   	function inicializarRecintos(){
		<%Recintos reci = new Recintos();%>
		
   		<%reci = (Recintos) session.getAttribute("listaCompletaRecintos");%>
   		<%if (reci != null) {%>
			<%for (int i = 0; i < reci.getTodosRecintos().size(); i++) {%>
				recBD.push("<%=reci.getTodosRecintos().get(i)%>");
			<%}%>	
			inicialiceRecintosDisponibles();
		<%}else%>z.submit();
 	}
	
	function inicialiceRecintosDisponibles(){//funcion preparada para rellenar lista recintos disponibles

		var listaRecintos=[];
		for(var i=0;i<recBD.length;i++)//Copia en local para trabajar
			listaRecintos.push(recBD[i]);

		for(var k=0;k<listaRecintos.length;k++){
			var nuevaFila = document.createElement("tr");
			nuevaFila.id = "fila_" + k;
			var nuevaCelda = document.createElement("td");
			nuevaCelda.id = "celda_" + k;
			var textCeldaVacia=listaRecintos[k];
			nuevaCelda.onclick=function(){selectedRecintoDisponible(this)};
			nuevaCelda.appendChild(document.createTextNode(textCeldaVacia));
			nuevaFila.appendChild(nuevaCelda);
			document.getElementById("table_Recintos_Disponibles").appendChild(nuevaFila);

		}

	}
	
	
	function selectedRecintoDisponible(elem){//guarda el valor de onclick de la tabla recintos disponibles
		rowDisp=elem;
	}
	
	function selectedRecintoAsignado(elem){//guarda el valor de onclick de la tabla recintos asignados
		rowAsig=elem;
	}
	
	function selectedSesionDisponible(elem){//guarda el valor de onclick de la tabla recintos disponibles
		rowDispS=elem;
	}
	
	function selectedSesionAsignada(elem){//guarda el valor de onclick de la tabla recintos asignados
		rowAsigS=elem;
	}
	
	function moveRowDisponibleToAsignado(){
		if(rowDisp!="" && !document.getElementById("table_Recintos_Asignados").hasChildNodes()){
			var nuevaFila =rowDisp.parentNode;
			nuevaFila.id=rowDisp.parentNode.id;
			var nuevaCelda =rowDisp;
			nuevaCelda.id=rowDisp.id;
			nuevaCelda.onclick=function(){selectedRecintoAsignado(this)};
			nuevaFila.appendChild(nuevaCelda);
			document.getElementById("table_Recintos_Asignados").appendChild(nuevaFila);
			document.getElementById("table_Recintos_Disponibles").removeChild(document.getElementById(rowDisp.parentNode.id));
		}
		rowDisp="";
	}
	
	function moveRowAsignadoToDisponible(){
		if(rowAsig!=""){
			var nuevaFila =rowAsig.parentNode;
			nuevaFila.id=rowAsig.parentNode.id;			
			var nuevaCelda =rowAsig;
			nuevaCelda.id=rowAsig.id;
			nuevaCelda.onclick=function(){selectedRecintoDisponible(this)};
			nuevaFila.appendChild(nuevaCelda);
			document.getElementById("table_Recintos_Disponibles").appendChild(nuevaFila);
			document.getElementById("table_Recintos_Asignados").removeChild(document.getElementById(rowAsig.parentNode.id));
		}
		rowAsig="";
	}
	
	function moveRowDisponibleSToAsignadoS(){
		if(rowDispS!="" && !document.getElementById("table_Sesiones_Asignadas").hasChildNodes()){
			var nuevaFila =rowDispS.parentNode;
			nuevaFila.id=rowDispS.parentNode.id;
			var nuevaCelda =rowDispS;
			nuevaCelda.id=rowDispS.id;
			nuevaCelda.onclick=function(){selectedSesionAsignada(this)};
			nuevaFila.appendChild(nuevaCelda);
			document.getElementById("table_Sesiones_Asignadas").appendChild(nuevaFila);
			document.getElementById("table_Sesiones_Disponibles").removeChild(document.getElementById(rowDispS.parentNode.id));
		}
		rowDispS="";
	}
	
	function moveRowAsignadoSToDisponibleS(){
		if(rowAsigS!=""){
			var nuevaFila =rowAsigS.parentNode;
			nuevaFila.id=rowAsigS.parentNode.id;			
			var nuevaCelda =rowAsigS;
			nuevaCelda.id=rowAsigS.id;
			nuevaCelda.onclick=function(){selectedSesionDisponible(this)};
			nuevaFila.appendChild(nuevaCelda);
			document.getElementById("table_Sesiones_Disponibles").appendChild(nuevaFila);
			document.getElementById("table_Sesiones_Asignadas").removeChild(document.getElementById(rowAsigS.parentNode.id));
		}
		rowAsigS="";
	}
	
	function crearEspectaculoNuevo(){
		alert("ha llegado");
		<%String sesionJS;
		sesionJS=(String)request.getParameter("nuevaSesion");
		if (sesionJS != null) {
			%>alert("entra el js");<%
   			JSONParser parser = new JSONParser();
   			JSONObject jSesion = (JSONObject) parser.parse(sesionJS);
   			String nombreRec = (String) jSesion.get("sRecinto");
   			String nombreEsp = (String) jSesion.get("sNombre");
   			String sfecha=(String) jSesion.get("sFecha"); 			
   			Sesion nuevaSesion = new Sesion(sfecha, nombreEsp, nombreRec);
   			session.setAttribute("nuevaSesion", nuevaSesion);
   		}
   		%>
   			var formulario = document.createElement("form");
   			formulario.id="formAction5";
   			formulario.action="CrearSesion";
   			formulario.submit();
   	}
	

</script>

<script>
	var oculto1 = document.getElementById("name_recinto");
	var oculto2 = document.getElementById("name_espectaculo");
// y uso oculto en donde me haga falta
</script>

</head>
<body>

<input type="hidden" id="name_recinto" value="" />
<input type="hidden" id="name_espectaculo" value="" />
<span style="width=130" style="height=100"></span>

<table>

	<tr>
		<td>
		<span style="float: left;">Nombre:</span>
		<input class="text" style="float: left;" type="text" name="nombreRecinto" id="name_Esp" size="60" maxlength="60"/>		
		</td>
	</tr>
	<tr>
		<td></td>
	</tr>
	
	<tr>
	<td>
	RECINTOS
	</td>
	</tr>
	
	<tr>
		<td>
			<table id="table_Recintos_Disponibles" onclick="">
			<tr>					
			</tr>
			</table>
		</td>
	</tr>
	<tr>
		<td>
		</td>
	</tr>
	<tr>
		<td>
		<button type="button" onclick="moveRowDisponibleToAsignado()"><img src="./imagenes/flechas/fv.png" width="120" height="60"> Agregar </button>
		<button type="button" onclick="moveRowAsignadoToDisponible()"><img src="./imagenes/flechas/fr.png" width="120" height="60"> Quitar </button>
		</td>
		<td>
		
		</td>
	</tr>
	<tr>
		<td>
		</td>
	</tr>
	<tr>
		<td>
			<table id="table_Recintos_Asignados" onclick="">
				<tr>
					
				</tr>
			</table>
		</td>
	</tr>
</table>

<table>
	<tr>
	<td>
	SESIONES
	</td>
	</tr>
	<tr>
		<td>
			<table id="table_Sesiones_Disponibles" onclick="">
				<tr>
					<td id="SesionCelda_0" onclick=selectedSesionDisponible(this)>2014-08-22 9:00</td>
				</tr>
				<tr>
					<td id="SesionCelda_1" onclick=selectedSesionDisponible(this)>2014-07-02 10:00</td>
				</tr>
				<tr>			
					<td id="SesionCelda_2" onclick=selectedSesionDisponible(this)>2014-08-21 11:00</td>
				</tr>
				<tr>			
					<td id="SesionCelda_3" onclick=selectedSesionDisponible(this)>2014-06-22 12:00</td>
				</tr>
			</table>
		</td>
	</tr>
	
	<tr>
		<td>
		</td>
	</tr>
	
	<tr>
		<td>
			<button type="button" onclick="moveRowDisponibleSToAsignadoS()"><img src="./imagenes/flechas/fv.png" width="120" height="60"> Agregar </button>			
			<button type="button" onclick="moveRowAsignadoSToDisponibleS()"><img src="./imagenes/flechas/fr.png" width="120" height="60"> Quitar </button>
		</td>
		<td>
			
		</td>
	</tr>
	
	<tr>
		<td>
			
		</td>
	</tr>

	<tr>
		<td>
			<table id="table_Sesiones_Asignadas" onclick="">
			</table>			
		</td>
	</tr>

</table>
<form>
<button type="button" onclick="almacenarSesion()" class="botoncito3"> Crear Recinto </button>
</form>	

</body>
</html>